.service-container {
  .service-panel {
    width:670rpx;
    background-color: #fff;
    border-radius: 40rpx;
    margin: 20rpx auto 0;
    box-shadow:0px 20rpx 20rpx 0px rgba(153,174,223,0.1);
    padding: 20rpx;
  }
  .service-title {
    border-bottom: 2rpx solid #EAEAEA;
    color:#999;
    padding: 20rpx 0;
  }
  .service-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 20rpx 0 0;
  }
  .service-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 25%;
    padding: 20rpx 0;
    .service-item-icon {
      width: 56rpx;
      height: 56rpx;
    }
    .service-item-txt {
      color: #333;
      font-size: 26rpx;
      padding-top: 10rpx;
    }
  }
  .list{
    .angel-up{
      position: absolute;
      right: 2rpx;
      top: 50%;
      margin-top: -12rpx;
      &:after{
        content: '';
        display: block;
        width: 24rpx;
        height: 24rpx;
        border-left: 2rpx solid #888888;
        border-top: 2rpx solid #888888;
        border-radius: 4rpx;
        transform: rotate(223deg);
        transition: transform .2s ease-in-out
      }
    }
    .angel-down{
      &:after{
        transform: rotate(45deg)
      }
    }
    .s-li{
      padding: 20rpx 20rpx;
      border-bottom: 2rpx solid #EAEAEA;
      .text{
        color:rgba(117,121,140,1);
        display: block;
        margin-top: 20rpx;
        height: 0px;
        overflow: hidden;
        transition: height 3s ease-in-out;
      }
      .isDrop{
        height: auto;
      }
    }
    .s-li:last-child{
      border-bottom: 0;
    }
  }
}